import React, { useEffect, useState } from "react";
import axios from "../../http/axios";
import style from "./index.module.scss";
import { useNavigate } from "react-router-dom";
import { ShareO, Chat, GoodJob } from "@react-vant/icons";
const Index: React.FC = () => {
  const navigate = useNavigate();
  const [itemData, setItemData] = React.useState([]);
  const getlist = async () => {
    const res = await axios.get("/api/date");
    const { data } = res.data;
    const newdata = data.filter((item: any) => {
      return item.flag == true;
    });
    console.log(newdata);
    setItemData(newdata);
  };
  const xq = (id: any) => {
    console.log(id);
    navigate(`/kepuhaoxq/${id}`);
  };
  const dz = (id: any) => {};
  useEffect(() => {
    getlist();
  }, []);
  return (
    <div>
      {itemData.length == 0 ? (
        <div>您还没有关注任何科普号，看看推荐的内容</div>
      ) : (
        <div>
          {itemData.length > 0 &&
            itemData.map((item: any, index) => {
              return (
                <div
                  className={style.list}
                  key={index}
                  onClick={() => xq(item.id)}
                >
                  <div className={style.listitem}>
                    <div>
                      <img src={item.image} alt="" />
                    </div>
                    <div>
                      <div className={style.name1}>{item.name}医生的科普号</div>
                      <span>
                        {item.name} {item.type} {item.keshi} {item.hospital}
                      </span>
                    </div>
                  </div>
                </div>
              );
            })}
        </div>
      )}
    </div>
  );
};

export default Index;
